本网页使用Webfrom 开发 开发工具 vistual Studio 2022 本地安装 Vue.js 前端框架element uijs 使用 ajax 请求在渲染前端时 加载element 表格 时 在表格中加入:v-loading='loading' 属性加载时 使用双向绑定 在settimeout中改变loading 变量值 前端断点调试时打印loading值已经改变 可是页面并没有效果 而且其他表格的事件都触发不了 现在不清楚是兼容问题还是版本问题,但是在layout 母版页 @click 事件可以触发 但是到了子页面 ResourceData 可以请求接口却触发不了事件 且页面的表格的数据加载好了 却触发不了表格的各种事件(包括多选单击事件等等都触发不了)
主页
系统主页
系统记录
资源中心
配置管理
权限配置
角色配置
属性配置
个人主页
系统设置
退出登录
查看更多
—————————————— Do you Want Codeing Together? Going ichigo Demo ——————————————
//Vue.prototype.ΩappName = 'ichigo app'
var app = new Vue({
el: '#Home',
data: {
Show: true,
CircleUrl: "",
CurrentDate: "",
},
beforeCreate() {
//console.log(this.ΩappName)
},
mounted() {
let that = this;
that.PageLoading();
},
methods: {
PageLoading() {
this.Show = false;
this.GetUserCode();
this.GetUserInfo();
},
GetUserCode() {
//为了避免中文乱码,应该对值进行URL编码(使用时需要URL解码)
$.ajax({
type: "POST",
url: "/Ashx/Home/Home.ashx?action=GetUserCode",
async: false,
data: {},
success: function (data) {
if (data != null) {
localStorage.setItem("U_Code", data.Data);
}
else {
location.href = "http://localhost:62457/Page/ErrorPage/501.html"
}
},
error: function (e) {
location.href = "http://localhost:62457/Page/ErrorPage/404.html"
}
});
},
GetUserInfo() {
let that = this;
$.ajax({
type: "GET",
url: "/Ashx/Home/Home.ashx?action=GetUserInfo",
async: false,
dataType: "json",
success: function (data) {
if (data == null) {
location.href = "http://localhost:62457/Page/LoginPage/Login.aspx"
}
else {
that.CircleUrl = data.Data.UI_Img;
}
},
error: function (e) {
that.$message.warning('个人信息不完整,请前往个人中心补充');
}
});
},
GoUserInfoPage() {
location.href = "http://localhost:62457/Page/UsersInfoPage/UserInfo.aspx"
},
GoResourceDataPage() {
location.href = "http://localhost:62457/Page/ResourceDataPage/ResourceData.aspx"
},
SelectMoudle(key, keyPath) {
console.log(key, keyPath);
}
}
})
.el-menu.el-menu--horizontal {
border-bottom: none;
}
.IndexImg {
background-size: cover;
background-position: center;
align-content: center;
}
.el-avatar > img {
width:100%;
/*object-fit: fill;*/
}
.MyIndex {
display: flex;
width: 100vw;
height: 100vh;
margin: auto;
font-weight: 100;
font-family: "Microsoft YaHei",微软雅黑;
}
.HeadAnima {
margin: auto;
height: 20%;
width: 100%;
}
.BodyAnima {
margin: auto;
height: 20%;
width: 100%;
}
.FooterAnima {
margin: auto;
height: 20%;
width: 100%;
}
.el-menu-demo {
width: 40%;
display: inline-block;
}
.JobTab {
width: 80%;
display: flex;
}
.SearchContent {
display: inline-block;
height: auto;
width: 60%;
}
.MyInputSearch {
padding: 10px;
width: 100%;
}
.block {
padding: 4px;
display: flex;
}
.Headimg {
width: 20%;
display: flex;
}
.HeadContent {
display: flex;
width: 40%;
align-items: center;
}
.ContentLeft {
width: 60%;
display: flex;
align-items: center
}
.MyHead {
height: 20%;
width: 100%;
display: flex;
margin: auto;
border: 1px solid #EEEEEE;
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
}
.MyFooter {
height: 20%;
width: 100%;
margin: auto;
display: flex;
border: 1px solid #EEEEEE;
background-color: white;
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
}
.MyBody {
height: 60%;
width: 100%;
margin: 0px 0px 0px 0px;
display: flex;
border: 1px solid #EEEEEE;
background-color: #f7f7f7;
}
.FootText {
text-align: center;
font-size: 12px;
color: #c1c1c1;
display: flex;
align-items: center;
margin: auto;
font-weight: 100;
font-family: "Microsoft YaHei",微软雅黑;
}
.ResDataBox {
display: flex;
justify-content: center;
align-content: center;
width: 100%;
height: 100%;
border: 1px solid #eaeaea;
}
.ResTable {
overflow: revert;
}
.Respagination {
display:flex;
}
.RD_Name_Class {
font-size:13px;
font-optical-sizing:auto;
font-palette:dark;
font-weight:400;
}
{{scope.row.RD_Name}}
{{scope.row.RD_Url.length>10?scope.row.RD_Url.slice(0,35)+'...':'0'}}
{{scope.row.RD_State== 0 ? '可用':scope.row.RD_State== -1?'损坏':'过期'}}
{{scope.RD_CreateTime=scope.row.RD_CreateTime.slice(0,10)+' '+scope.row.RD_CreateTime.slice(11,19)}}
{{scope.RD_UpdateTime=scope.row.RD_UpdateTime.slice(0,10)+' '+scope.row.RD_UpdateTime.slice(11,19)}}
var app=new Vue({
el: "#Resource",
data:{
show: true,
loading: true,
tableData: [{}],
multipleSelection: []
},
mounted() {
setTimeout(() => {
this.loading = false;
console.log(this.loading)
},2000)
this.GetResourceDataList();
},
methods: {
GetResourceDataList() {
let that = this;
//axios.get('/Ashx/ResourceData/ResourceData.ashx', { action:"GetResourceDataList"}).then((d) => {
// console.log("ABCD",d);
//}).catch((err) => {
// console.log(err)
//})
$.ajax({
type: "GET",
url: "/Ashx/ResourceData/ResourceData.ashx?action=GetResourceDataList",
async: false,
dataType: "json",
success: function (data) {
console.log(data);
that.tableData = data.Data;
},
error: function (e) {
that.MsgError("错误消息", "请求资源错误!!")
}
});
},
MsgError(title, val) {
this.$notify.error({
title: title,
message: val
});
},
handleClick(scope, row) {
console.log(scope)
},
handleSelectionChange(val) {
this.multipleSelection = val;
console.log(val)
},
RowClick() {
console.log(1111)
}
}
})
|